<template>
  <article class="page">
    <headerbar>评论内容</headerbar>

    <section class="frame-content bg-light-gray list-news-img bg-white">

      <cube-scroll
        ref="scroll"
        :options="options"
        @pulling-up="onPullingUp"
      >
        <div class="item" v-for="(item,index) in list" :key="index">
          <div class="avatar-img" v-if="false">
            <img src="../../../../static/images/default.jpg" alt="">
          </div>
          <div class="cont">
            <h2 class="name">{{item.userName}}:   {{item.content}}</h2>
            <p class="tip">{{getTime(item.createTime)}} <span class="pull-right color-tip delete-text" v-if="isMyComment(item, index)" @click="deleteComment(item)">删除</span></p>
            <div class="text-wrap"></div>
          </div>
        </div>
<!--        <div class="text-center no-data" v-if="list.length===0 && showNoData">
          <img src="../../../../static/images/no_data.png" alt="">
          <p>暂无数据</p>
        </div>-->
        <noData v-if="list.length===0 && showNoData"></noData>
      </cube-scroll>

    </section>
  </article>
</template>


<script>
  import footerbar from '@/components/layout/footerbar.vue'
  import moment from 'moment'
  let myInfo = {}
  export default {
    name: 'myActivities',
    data () {
      return {
        list: [],
        files: [],
        attachmentList: [],
        pageIndex: 1,
        pageSize: 20,
        isLoading: false,
        detail: {},
        options: {
          pullUpLoad: true,
          scrollbar: false
        },
        evaluateData: {},
        showNoData: false
      }
    },
    created () {
      this.evaluateData = this.$localStorage.get('evaluateData')
      myInfo = this.tools.getUserInfo()
      this.fetchList()
    },
    methods: {
      isMyComment(item) {
        return item.createBy === myInfo.id
      },
      fetchList (id) {
        this.showNoData = false
        this.isLoading = true
        let data = {
          newsId: this.evaluateData.id,
          page: this.pageIndex,
          limit: this.pageSize,
          params: {}
        }
        return this.fetchService.getFriendComment(data).then(res => {
          this.showNoData = true
          if (res.code !== 0) {
            return this.tools.alert(res.message || res.resp_msg || '接口出错，请联系管理员')
          }
          this.isLoading = false
          this.pageIndex++
          this.list = this.list.concat(res.data)
          if (res.data.length === 0 && this.pageIndex !== 2) {
            this.tools.tip('暂无更多')
          }
          return res
        })
      },
      hasList () {
        return this.list.length > 0 || this.topList.length > 0
      },
      onPullingUp () {
        this.fetchList().then(res => {
          setTimeout(() => {
            this.$refs.scroll.forceUpdate && this.$refs.scroll.forceUpdate(true, false)
            this.options.isPullUpLoad = false
          }, 100)
        })
      },
      getTime (createTime) {
        return moment(createTime).format('YYYY-MM-DD HH:ss')
      },
      deleteComment (item, index) {
        let me = this
        this.$createDialog({
          type: 'confirm',
          icon: '',
          title: '温馨提示',
          content: '确定删除？',
          confirmBtn: {
            text: '确定',
            active: true,
            disabled: false,
            href: 'javascript:;'
          },
          cancelBtn: {
            text: '取消',
            active: false,
            disabled: false,
            href: 'javascript:;'
          },
          onConfirm: () => {
            console.log('deleteComment', item)
            me.fetchService.friendCommentDelete({id: item.id}).then(res => {
              if (res.code === 0) {
                me.list.splice(index, 1)
              }
            })
          }
        }).show()
      }
    }
  }
</script>

<style scoped lang="scss">
  .cont {
    .name {
      font-size:16PX;
    }
    .tip {
      font-size:14PX;
    }
  }
</style>
